<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>酒店预订，酒店查询</title>
    <link rel="stylesheet" href="../public/daohang.css">
    <link rel="stylesheet" href="../static/css/reset.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_1972937_ook7ugcj3y.css">
    <link rel="stylesheet" href="./Hotel.css">
</head>
<body>
<header id="xc-header">
    <div class="xc-header-mid">
        <div class="xc-header-right">
            <a class="xc-header-a" href="../Index/Index.html">
                <img class="xc-header-img" src="../static/imgs/1.png" alt="" width="203px" height="34px">
            </a>
        </div>
    </div>
</header>
<div id="xc-banner">
    <div class="xc-banner-mid">
        <ul class="xc-ul-item">
            <li class="xc-item"><a class="xc-a" href="../Index/Index.html">首页</a></li>
            <li class="xc-item" ><a class="xc-a" href="../Travel/Travel.html" >旅游</a></li>
            <li class="xc-item"><a class="xc-a" href="../Strategy/Strategy.html">攻略</a></li>
            <li class="xc-item"><a class="xc-a" href="../Hotel/Hotel.html">酒店</a></li>
            <li class="xc-item"><a class="xc-a" href="../Buying_tickets/Buying_tickets.html">购票</a></li>
            <li class="xc-item"><a class="xc-a" href="../Order/Order.html">订单</a></li>
        </ul>

        <div class="xc-banner-right">
            <div class="xc-item"><a class="xc-a" href="../User/Register.html">注册</a></div>
            <div class="xc-item"><a class="xc-a" href="../User/User.html">登录</a></div>
        </div>
    </div>
</div>
<div id="xc-content">
    <div class="xc-content-left">
        <div class="xc-content-left-search">
            <div class="xc-content-left-top" >
                <p><img src="../static/imgs/bed.png"><b>搜索国内酒店</b></p>
            </div>

            <form class="xc-content-select">
                <input type="radio" name="sele" value="hotel">酒店
                <input type="radio" name="sele" value="home">客栈民宿
            </form>

            <div class="xc-content-input">
                <table cellspacing="0" cellpadding="0" class="searchbox">
                    <colgroup>
                        <col>
                        <col class="col2">
                        <col class="col3">
                        <col>
                    </colgroup>
                    <tbody>
                    <tr>
                        <th>目的地</th>
                        <td colspan="3"><input autocomplete="on"placeholder="上海" type="text" ></td>
                    </tr>
                    <tr>
                        <th>入住日期</th>
                        <td colspan="3"><input type="date" value="2020-08-03"></td>
                    </tr>
                    <tr>
                        <th>退房日期</th>
                        <td colspan="3"><input type="date" value="2020-08-04"></td>
                    </tr>
                    <tr>
                        <th>房间数</th>
                        <td >
                            <select class="room-sel">
                                <option value="room">1间</option>
                                <option value="room">2间</option>
                                <option value="room">3间</option>
                                <option value="room">4间</option>
                                <option value="room">5间</option>
                                <option value="room">6间</option>
                                <option value="room">7间</option>
                                <option value="room">8间</option>
                                <option value="room">9间</option>
                                <option value="room">10间</option>
                            </select>
                        </td>
                        <th>住客数</th>
                        <td>
                            <select class="people-sel">
                                <option value="people">1成人</option>
                                <option value="people">2成人</option>
                                <option value="people">3成人</option>
                                <option value="people">4成人</option>
                                <option value="people">5成人</option>
                                <option value="people">6成人</option>
                                <option value="people">7成人</option>
                                <option value="people">8成人</option>
                                <option value="people">9成人</option>
                                <option value="people">10成人</option>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <th>酒店级别</th>
                        <td colspan="3">
                            <select name="hotel-rank">
                                <option value="rank">不限</option>
                                <option value="rank">五星级/豪华</option>
                                <option value="rank">四星级/高档</option>
                                <option value="rank">三星级/舒适</option>
                                <option value="rank">二星级及以下/经济</option>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <th>关键词</th>
                        <td>
                            <input class="search" autocomplete="off" placeholder="(选填）酒店名/地标/商圈" type="text" vaule="input">
                        </td>
                    </tr>
                    </tbody>
                </table>
                <input type="submit" class="xc-content-search"value="搜索">

            </div>
        </div>

        <!--内容部分左边：酒店旗舰店列表-->
        <div class="hotel-store">
            <div class="list-item">
                <img src="../static/imgs/store1.png">
            </div>
            <div class="list-item">
                <img src="../static/imgs/store2.png">
            </div>
            <div class="list-item">
                <img src="../static/imgs/store3.jpg">
            </div>
        </div>
    </div>

    <!--内容部分的右边-->
    <div class="xc-content-right">
        <!--右边的顶部-->
        <div class="xc-content-right-top" onmouseover="stop()" onmouseout="start()">
            <!--            <div id="1" class="slide">-->
            <!--                <img src="imgs/bc1.png">-->
            <!--            </div>-->
            <!--            <div id="2" class="slide">-->
            <!--                <img src="imgs/bc2.png">-->
            <!--            </div>-->
            <div id="3" class="slide">
                <img src="../static/imgs/bc3.png">
            </div>
        </div>
        <div class="xc-content-right-middle">
            <div class="site">
                <h2>城市地标周边酒店
                    <a href="">北京</a>
                    <a href="">上海</a>
                    <a href="">广州</a>
                    <a href="">南京</a>
                    <a href="">深圳</a>
                </h2>
                <span class="dibiaoleft">
                    <a href="">全部地标></a>

                </span>
            </div>
            <div class="zanshitu">
                <img src="../static/imgs/zs.png" width="782" height="102">
            </div>
        </div>
        <div class="xc-content-right-hot">
            <div style="display: none;"class="cit">
                <a href="###" class="close">x</a>
                <a href="">长沙</a>
                <a href="">贵阳</a>
                <a href="">重庆</a>
                <a href="">福州</a>
                <a href="">桂林</a>
                <a href="">合肥</a>
                <a href="">海口</a>
                <a href="">哈尔滨</a>
                <a href="">丽江</a>
                <a href="">南昌</a>
                <a href="">南宁</a>
                <a href="">昆明</a>
            </div>
            <h2 class="hot-hotel">
                热门酒店
                <a href="">上海</a>
                <a href="">北京</a>
                <a href="">南京</a>
                <a href="">成都</a>
                <a href="">深圳</a>
                <a href="">广州</a>
                <span class="hot-log">
                    <img src="../static/imgs/span2.png">
                </span>
            </h2>

        </div>
        <!--酒店列表-->
        <div class="hotel-list">
            <div class="hotel-item">
                <div class="img-wrapper">
                    <img src="../static/imgs/hotel1.jpg">
                </div>
                <div class="text-wrapper">
                    <a class="title" href=""><img src="../static/imgs/zan.png"> 云和夜泊酒店</a><br/>
                    <a class="local" href=""><u>南汇/野生动物园   浦东新区</u></a><br/>
                    <a class="grade" href="">4.9分|来自16089人点评</a>
                    <p class="estimate">"酒店的服务真的跟海底捞一样好。半夜老公肚子疼，值班经理旺旺半夜开车带我老公去医院。手机没有电帮拿的充电宝，还帮先交了药费。真的超级无敌感动。接送的车都特别方便。早饭也挺好。住吧肯定不会让你们失望。”</p>
                </div>
                <div class="price-wrapper">
                    <span class="icon">￥</span>
                    <span class="number">655</span>
                    <span class="up">起</span>
                </div>
            </div>
            <hr>
            <div class="hotel-item">
                <div class="img-wrapper">
                    <img src="../static/imgs/hotel2.jpg">
                </div>
                <div class="text-wrapper">
                    <a class="title" href=""><img src="../static/imgs/zan.png"> 上海如果遇见你小墅</a><br/>
                    <a class="local" href=""><u>朱家角   青浦区</u></a><br/>
                    <a class="grade" href="">4.9分|来自92人点评</a>
                    <p class="estimate">"周末和朋友们一起邀约去朱家角散心，搜到这家评分不错的民宿，三家人订了三间房。这家店位置离景区很近，但又没有景区内的喧闹。房间布置也甚合吾意，美女老板也极周到热情。晚上点了外卖，和朋友在店中伴着手机轮流和歌唱咏，饮酒畅叙，晤言一室，放浪形骸，约醉兴怀，人间散仙，期待下次！”</p>
                </div>
                <div class="price-wrapper">
                    <span class="icon">￥</span>
                    <span class="number">456</span>
                    <span class="up">起</span>
                </div>
            </div>
            <hr>
            <div class="hotel-item">
                <div class="img-wrapper">
                    <img src="../static/imgs/hotel3.jpg">
                </div>
                <div class="text-wrapper">

                    <a class="title" href=""><img src="../static/imgs/zan.png"> 上海浦东丽思卡尔顿酒店</a>
                    <br/>
                    <a class="local" href=""><u>浦东陆家嘴金融贸易区   浦东新区</u></a><br/>
                    <a class="grade" href="">4.7分|来自2466人点评</a>
                    <p class="estimate">不错，房间俯瞰整个陆家嘴。”</p>
                </div>
                <div class="price-wrapper">
                    <span class="icon">￥</span>
                    <span class="number">2099</span>
                    <span class="up">起</span>
                </div>
            </div>
            <hr>
            <div class="hotel-item">
                <div class="img-wrapper">
                    <img src="../static/imgs/hotel4.jpg">
                </div>
                <div class="text-wrapper">
                    <a class="title" href=""><img src="../static/imgs/zan.png"> 上海三湘大厦</a><br/>
                    <a class="local" href=""><u>虹桥地区   长宁区</u></a><br/>
                    <a class="grade" href="">4.5分|来自538人点评</a>
                    <p class="estimate">"停车可以吗”</p>
                </div>
                <div class="price-wrapper">
                    <span class="icon">￥</span>
                    <span class="number">398</span>
                    <span class="up">起</span>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>